<template>
	<div>
	<vxe-modal v-model="dialogVisible" title="车辆列表" width="60%" height="65%" show-zoom resize remember>
		<template #default>
		<div class="search-wrapper">
			<el-form class="search-param" ref="pageParam" :model="pageParam" label-width="100px" size="mini">
				<el-form-item label="车辆号">
					<el-input v-model="pageParam.batNo" clearable></el-input>
				</el-form-item>
				<el-form-item label="车牌号">
					<el-input v-model="pageParam.batModelId" clearable></el-input>
				</el-form-item>
				<el-form-item style="margin-left: -60px;">
					<el-button type="primary" size="mini" class="el-icon-search" @click="pageByParam">确认查询</el-button>
				</el-form-item>
			</el-form>
		</div>
		<!-- 数据表格 -->
		<vxe-toolbar ref="xToolbar1" custom print>
		</vxe-toolbar>
		<vxe-table show-overflow :column-config="{resizable: true}" height="340" :loading="loading"
			:data="tableData.list" size="mini" border stripe>
			<vxe-column field="batNo" title="车辆号"></vxe-column>
			<vxe-column field="batTypeId" title="车牌号"></vxe-column>
			<vxe-column field="sendTime" title="数据时间"></vxe-column>
			<vxe-column field="pd" title="生产日期"></vxe-column>
			<vxe-column field="sd" title="销售日期"></vxe-column>
			<vxe-column field="createTime" title="创建时间"></vxe-column>
			<vxe-column title="操作" width="130" show-overflow>
				<template #default="{ row }">
					<vxe-button status="primary" @click="addEditClick(row)">选择</vxe-button>
				</template>
			</vxe-column>
			<!-- <vxe-column field="_X_ID" title="_X_ID"></vxe-column> -->
		</vxe-table>
		<vxe-pager background size="small" stripe :loading="loading" :current-page="pageParam.pageNo"
			:page-size="pageParam.pageSize" :total="tableData.totalRow"
			:page-sizes="[15, 20, 100, {label: '大量数据', value: 1000}, {label: '全量数据', value: -1}]"
			:layouts="['PrevPage', 'JumpNumber', 'NextPage', 'FullJump', 'Sizes', 'Total']"
			 background class="page-wrapper" @page-change="handleCurrentChange">
		</vxe-pager>
		</template>
		</vxe-modal>
	</div>
</template>

<script>
	import request from '@/utils/request'
	import miniRedius from '@/shop/common/mini_radius.vue';
	import {
		list,
		del
	} from './capacity.js'
	export default {
		components: {
			miniRedius,
		},
		data() {
			return {
				loading: true,
				dialogVisible: false,
				timer: [],
				pageParam: {
					batModelId: '', //电池型号ID
					batNo: '', //车辆号
					batTypeId: '', //电池类型id
					operationDepartment: '', //所属运营部门ID
					pageNo: 1,
					pageSize: 15
				},
				tableData: {
					totalRow: 0,
					list: []
				}
			}
		},
		created() {
			this.oldlist();
		},
		methods: {
			open(){
				this.dialogVisible = true;
			},
			pageByParam() {
				this.pageParam.pageNo = 1;
				this.pageParam.pageSize = 15;
				this.oldlist()
			},
			// handleSizeChange(val) {
			// 	this.pageParam.pageNo = 1;
			// 	this.pageParam.pageSize = val;
			// 	this.oldlist();
			// },
			handleCurrentChange(val) {
				if(val.type=="size"){
					this.pageParam.pageNo = 1;
					this.pageParam.pageSize = val.pageSize;
					this.oldlist();
				}
				if(val.type=="current"){
					this.pageParam.pageNo = val.currentPage;
					this.pageParam.pageSize = val.pageSize;
					this.oldlist();
				}
			},
			async oldlist() {
				this.loading = true;
				let result = await list(this.pageParam);
				//console.log("返回结果", result.data);
				this.loading = false;
				this.tableData.totalRow = result.total;
				this.tableData.list = result.data;

			},
			addEditClick(e){
				console.log(e);
				this.dialogVisible = false;
				this.$emit("selebatno",e);
			}
		}
	}
</script>

<style>
</style>
